<!DOCTYPE html>
<html lang="ZH-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <title>Title</title>
    <link rel="stylesheet" href="../static/css/index.css">
    <link rel="stylesheet" href="../static/css/pop.css">
    <link rel="stylesheet" href="../static/css/s1.css">
    <style>
        :root {
            --x-head-height: 4em;
            --x-blue-hue: 240;
            --x-red-hue: 240;
            --x-soloarLight-hue: 60;
            --x-main-hue: var(--x-soloarLight-hue);
            --x-text-color: 360;
        }
    </style>
    <script src="../static/js/jQuery.js"></script>
</head>
<body>

    <header>
        <nav id="headMid">
            <div id="midHeadLeft">
                <div id="title">家教管理系统</div>
            </div>
            <ul id="midHeadRight">
                <li>
                    <button id="logout">退出</button>
                </li>
            </ul>
        </nav>

        <hr>
    </header>
    <aside>
        <div id="asideArea">
            <div id="mySidenav">
                <a href="#" id="bt1" class="asideActive">职工信息</a>
                <a href="#" id="bt2">职工作息</a>
                <a href="#" id="bt3">工资表</a>
                <a href="#" id="bt4">收费表</a>
            </div>
        </div>

    </aside>
    <main id="main">
        <div id="tips">
            tips here
        </div>
        <div id="mainHead">
            <p id="tbTitle">职工信息</p>
            <button id="tb1only">新增</button>
            <button id="tb1all">统计</button>
            <button id="tb1search">查找</button>
            <button id="tb2all">时刻统计</button>
        </div>
        <table class="active">
            <thead>
            <tr>
                <th scope="col">职工号</th>
                <th scope="col">姓名</th>
                <th scope="col">性别</th>
                <th scope="col">年龄</th>
                <th scope="col">学科</th>
                <th scope="col">地址</th>
                <th scope="col">电话</th>
                <th scope="col">职业</th>
                <th scope="col">注册时间</th>
                <th scope="col">操作</th>
            </tr>
            </thead>
            <tbody id="tb1">
            </tbody>
        </table>
        <table>
            <thead>
            <tr>
                <th scope="col">职工号</th>
                <th scope="col">姓名</th>
                <th scope="col">开始时间</th>
                <th scope="col">结束时间</th>
                <th scope="col">操作</th>
            </tr>
            </thead>
            <tbody id="tb2">
            </tbody>
        </table>
        <table>
            <thead>
            <tr>
                <th scope="col">职工号</th>
                <th scope="col">姓名</th>
                <th scope="col">学科</th>
                <th scope="col">工资</th>
                <th scope="col">操作</th>
            </tr>
            </thead>
            <tbody id="tb3">
            </tbody>
        </table>
        <table>
            <thead>
            <tr>
                <th scope="col">职工号</th>
                <th scope="col">姓名</th>
                <th scope="col">学科</th>
                <th scope="col">收费</th>
                <th scope="col">操作</th>
            </tr>
            </thead>
            <tbody id="tb4">
            </tbody>
        </table>
        <div class="bgc">
            <div class="title">新增</div>
            <div class="sub_title">必填</div>
            <div class="newData">
                <div class="center">
                    <input type="text" id="ar_pid" placeholder="职工号"/>
                    <div class="genderBox">
                            <span>性别
                                <label for="1">
                                    <input type="radio" name="sex" value="male"
                                           id="1"/><span>男</span>
                                </label>
                                <label for="2">
                                    <input type="radio" name="sex" vale="female"
                                           id="2"/><span>女</span>
                                </label>
                            </span>
                    </div>
                    <input type="text" id="ar_name" placeholder="姓名"/>
                    <input type="text" id="ar_age" placeholder="年龄"/>
                    <input type="text" id="ar_subj" placeholder="学科"/>
                    <input type="text" id="ar_addr" placeholder="地址"/>
                    <input type="text" id="ar_phone" placeholder="电话"/>
                    <input type="text" id="ar_profession" placeholder="职业"/>
                </div>
                <div class="bottom">
                    <button id="ar_submit">提交</button>
                    <button id="ar_cancel">取消</button>
                </div>
            </div>
        </div>
        <div class="edit_register">
            <div class="title">编辑</div>
            <div class="sub_title">可选</div>
            <div class="newData">
                <div class="center">
                    <input type="text" id="mr_name" placeholder="姓名"/>
                    <div class="genderBox">
                            <span>性别
                                <label for="3">
                                    <input type="radio" name="gender"
                                           value="male"
                                           id="3"/><span>男</span>
                                </label>
                                <label for="4">
                                    <input type="radio" name="gender"
                                           vale="female"
                                           id="4"/><span>女</span>
                                </label>
                            </span>
                    </div>
                    <input type="text" id="mr_age" placeholder="年龄"/>
                    <input type="text" id="mr_subj" placeholder="学科"/>
                    <input type="text" id="mr_addr" placeholder="地址"/>
                    <input type="text" id="mr_phone" placeholder="电话"/>
                    <input type="text" id="mr_profession" placeholder="职业"/>
                </div>
                <div class="bottom">
                    <button id="mr_submit">提交</button>
                    <button id="mr_cancel">取消</button>
                </div>
            </div>
        </div>
        <div class="edit_schedule">
            <div class="title">编辑</div>
            <div class="newData">
                <div class="center">
                    <!-- <input type="text" id="s_start" placeholder="" />
                    <input type="text" id="s_end" placeholder="" /> -->
                    <label for="s_start">开始时间：</label>
                    <input id="s_start" type="datetime-local"
                           value="2023-06-01T08:30">
                    <label for="s_end">结束时间：</label>
                    <input id="s_end" type="datetime-local"
                           value="2023-06-01T13:30">
                </div>
                <div class="bottom">
                    <button id="s_submit">提交</button>
                    <button id="s_cancel">取消</button>
                </div>
            </div>
        </div>

        <div class="edit_salary">
            <div class="title">编辑</div>
            <div class="newData">
                <div class="center">
                    <input type="text" id="sa_salary" placeholder="工资"/>
                </div>
                <div class="bottom">
                    <button id="sa_submit">提交</button>
                    <button id="sa_cancel">取消</button>
                </div>
            </div>
        </div>
        <div class="edit_charge">
            <div class="title">编辑</div>
            <div class="newData">
                <div class="center">
                    <input type="text" id="c_charge" placeholder="收费"/>
                </div>
                <div class="bottom">
                    <button id="c_submit">提交</button>
                    <button id="c_cancel">取消</button>
                </div>
            </div>
        </div>
        <div id="count_p">
            <table>
                <thead>
                <tr>
                    <th scope="col">职工类型</th>
                    <th scope="col">需求总数</th>
                </tr>
                </thead>
                <tbody id="count_panel">
                </tbody>
            </table>
            <button id="count_btn">关闭</button>
        </div>
        <div class="search">
            <div class="title">查找</div>
            <div class="sub_title">条件</div>
            <div class="center sh_enter">
                <input type="text" id="sh_pid" placeholder="职工号"/>
                <input type="text" id="sh_name" placeholder="姓名"/>
                <input type="text" id="sh_profession" placeholder="职业"/>
                <input type="text" id="sh_subj" placeholder="学科"/>
            </div>
            <div class="sub_title">结果</div>
            <div id="result">
                <table>
                    <thead>
                    <tr>
                        <th scope="col">职工号</th>
                        <th scope="col">姓名</th>
                        <th scope="col">性别</th>
                        <th scope="col">年龄</th>
                        <th scope="col">学科</th>
                        <th scope="col">地址</th>
                        <th scope="col">电话</th>
                        <th scope="col">职业</th>
                        <th scope="col">注册时间</th>
                    </tr>
                    </thead>
                    <tbody id="result_panel">
                    </tbody>
                </table>
            </div>
            <div class="bottom">
                <button id="sh_submit">查询</button>
                <button id="sh_cancel">关闭</button>
            </div>
        </div>
        <div id="confirm">
            <div class="title">删除</div>
            <div class="bottom">
                <button id="d_submit">确定</button>
                <button id="d_cancel">取消</button>
            </div>
        </div>
        <div id="some">
            <svg width="500" height="400"
                 xmlns="http://www.w3.org/2000/svg">
                <g>
                    <path id="svg_36"
                          d="m234.99999,181.09686c21.2332,-56.70245 104.42557,0 0,72.90314c-104.42557,-72.90314 -21.2332,-129.60559 0,-72.90314z"
                          stroke="deepPink" fill="red"/>
                    <text fill="#FFAAB8" stroke="#000" x="135" y="310"
                          id="svg_1" stroke-width="0"
                          font-size="24" font-family="Noto Sans JP"
                          text-anchor="start" xml:space="preserve"
                          stroke-dasharray="5,5" font-style="normal"
                          font-weight="bold">Hearhearhearheart</text>
                    <path fill="red" id="svg_6"
                          d="m274.34915,230.27646l-6.54183,4.95917l2.50068,-8.02195l-6.54036,-4.95917l8.08451,0.00154l2.1487,-6.8978l0.35051,-1.12031l2.49626,8.01658l8.08671,0l-6.5433,4.95917l2.50142,8.02426l-6.5433,-4.96147l0,0z"/>
                    <path stroke="deepPink" id="svg_2"
                          d="m260.78947,217.89903c12.18441,-29.47035 59.92331,0 0,37.89045c-59.92331,-37.89045 -12.18441,-67.3608 0,-37.89045z"
                          fill="red"/>
                </g>
            </svg>
        </div>
    </main>
    <footer>
        <div id="footer">@2023-6-20
            <button id="svg">4REFIZ</button>
        </div>
    </footer>
</body>
<script src="../static/js/index.js"></script>
</html>